import React, { Component } from 'react';
import { withRouter } from 'react-router-dom'

import './left.css'

@withRouter
class Left extends Component {

    clickHandle=(v)=>{
        this.props.history.push(v.url)
    }

    render() {
        return (
            <div className="leftnav">
                <ul>
                    {this.props.data.map(v=>(
                        <li key={v.title} 
                        onClick={()=>this.clickHandle(v)}
                        style={this.props.location.pathname == v.url ? {color:'red'} : {}}
                        >{v.title}</li>
                    ))}
                </ul>
            </div>
        )
    }
}

export default Left